<template>
    <div class="withdraw">
        <div class="top">
            <el-breadcrumb separator=">">
                <el-breadcrumb-item  class="font-gray hand" :to="{ path: 'index' }">个人信息</el-breadcrumb-item>
                <el-breadcrumb-item class="hand font-white">出金</el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <div class="middle">
            <div class="middle-input">
              <p class="margin-bottom-20 font-gray">充币数量(USDT)</p>
              <div><input type="text" autofocus="autofocus" v-model="wValue" ></div>
              <div style="line-height: 20px;margin-top: 10px;">
                <span class="font-gray">DC账户余额 <span class="font-white">{{this.$store.state.userInfo['balance']}}</span></span>    
                <span class="font-aqua pull-right hand" @click="withdrawAll">全部提币</span>
              </div>  
            </div>

            <div class="middle-input margin-top-20">
              <p class="margin-bottom-20 font-gray">电子钱包地址</p>
              <div><input type="text" autofocus="autofocus" value="1HYjjdsadkaskdm,sods4af4sa4fsa4"></div> 
            </div>
             <div class="text-center font-gray margin-top-20" style="letter-spacing: 0.8px;">没有电子钱包,点击
                <router-link :to="{path:'withdraw'}"  style="color:#fff;">注册</router-link>
             </div>
            <div><button class="aqua-button" @click="getWithdraw">确定</button></div>
        </div>
    </div>
</template>
<script>
import {mapState} from 'vuex'
import {doWithdraw} from '@/ajax/index'
export default {
    name:'withdraw',
    data(){
        return{
            wValue:'11111'
        }
    },
    methods:{
        withdrawAll(){  
            this.wValue = this.$store.state.userInfo['balance'];
        },
        async getWithdraw(){
            const param = {
                'currency':'USDT',
                'amount':this.wValue,
                'address':'AsdsXZdFsdfsdf44asf4a',
                'remark':'6222021702057456121'
            }
            let result = await doWithdraw(param)
            if((result.code === '200') && (result.data.state === '1')){
                this.$alert('提现申请已发起','富易')
            }else{
                alert(result.data.message)
            }

        }
    }
}
</script>

<style>
.withdraw .el-breadcrumb{display: inline-block;font-size: 14px;line-height: 46px;}
.withdraw .el-breadcrumb__inner,.el-breadcrumb__inner a:hover, .el-breadcrumb__inner.is-link:hover{color: #72739c!important;}
.withdraw .el-breadcrumb__item:last-child .el-breadcrumb__inner,.el-breadcrumb__item:last-child .el-breadcrumb__inner:hover{color: #fff!important;cursor: pointer!important;}
.withdraw .el-form-item__label{color: #c3c4ea;padding-right: 20px;} 
.withdraw .el-input__inner{background-color: #242645;border: none;border-radius: 4px;text-align: right;color: #fff;}
.withdraw .code .el-input__inner{text-align: left;}
.recharge .el-input-group__append{background-color: #242645;border: none;border-left:1px solid;}
</style>

<style lang="less" scoped>
.withdraw{
     .top{margin-top: 50px;}
    .middle{
        width: 500px;
        margin: 50px auto;
        .middle-input{
            color:#fff;
            width: 100%;
            padding: 20px;
            background-color: #242645;
            border-radius: 4px;
            box-sizing: border-box;
            input{
                color: #fff;
                border: none;
                height: 30px;
                line-height: 28px;
                width: 100%;
                background-color: #242645;
                outline: none;
                font-size: 20px;
                caret-color: #4ec2e3;
                border-bottom: 1px solid #2e2f4d;
                border-radius: 2px;
                text-indent: 16px;
            }            
        }
        a{text-decoration: underline;color: #fff;}
        button{margin-top: 20px;width: 100%;height: 36px;line-height: 40px;border-radius: 4px;padding: 0;}
    }

}
</style>


